import { useMemo } from 'react';
import getScrollBarSize from '@root/lib/getScrollBarSize';
const { size: scrollSize, scrollBarType } = getScrollBarSize();

function useGenStyle(columns, type, scrollToLeft, scrollToRight) {
    const width = useMemo(() => {
        if (type === 'main') {
            return 'auto';
        }
        return columns.reduce((prev, crt) => (prev + crt.width), 0) + (type === 'right' && scrollBarType === 'occupy' ? scrollSize : 0);
    }, [columns]);

    let wrapperStyle = type === 'main' ? { flex: 1 } : { width };

    let headerStyle = { width };
    if (type === 'left' && !scrollToLeft) {
        wrapperStyle.boxShadow = '0px 6px 8px 0px rgba(0,0,0,0.1500)';
    } else if (type === 'right' && !scrollToRight) {
        wrapperStyle.boxShadow = '0px 6px 8px 0px rgba(0,0,0,0.1500)';
    }
    return { wrapperStyle, headerStyle };
}
export default useGenStyle;